<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>

<body>

      用户名  <input type="text" id="username"><span id="uSpan"></span><br/>
       密码 <input type="password"  id="password"><span id="pSpan"></span><br/>
        <button type="submit" onclick="login()">提交</button>

</body>
<script src="js/jquery-3.3.1.min.js"></script>
<script>
    function  login() {
        let username = $("#username").val();
        let password = $("#password").val();
        let flag = 0;
        if (username) {
            flag++;
            $("#uSpan").html("");
        } else {
            $("#uSpan").html("用户名不能为空");
        }

        if (password) {
            flag++;
            $("#pSpan").html("");
        } else {
            $("#pSpan").html("密码不能为空");
        }
        if (flag === 2) {
            $.post("userServlet", "username=" + username + "&password=" + password, function (data) {
                if (data.flag) {
                    location.href = "index.jsp";
                } else {
                    alert(data.msg)
                }
            }, "json"); // "url?username=zz&password=123"
        }
    }
</script>
</html>
